<div class="todo-card {% if todo.completed %}completed{% endif %}" data-id="{{ todo.id }}">
    <div class="todo-content">
        <div class="todo-header">
            <h3 class="todo-title">{{ todo.title }}</h3>
            <div class="todo-actions">
                <form action="{{ url_for('delete_todo_web', todo_id=todo.id) }}" method="POST" style="display: inline;">
                    <button type="submit" class="btn-icon delete-btn" onclick="return confirm('确定要删除吗？')">
                        <i class="fas fa-trash"></i>
                    </button>
                </form>
            </div>
        </div>

        {% if todo.description %}
        <p class="todo-description">{{ todo.description }}</p>
        {% endif %}

        <div class="todo-meta">
            <span class="todo-date">
                <i class="fas fa-calendar"></i>
                {{ todo.created_at }}
            </span>
            <span class="todo-status">
                {% if todo.completed %}
                <i class="fas fa-check"></i> 已完成
                {% else %}
                <i class="fas fa-clock"></i> 进行中
                {% endif %}
            </span>
        </div>
    </div>

    <a href="{{ url_for('todo_detail', todo_id=todo.id) }}" class="todo-link">
        <i class="fas fa-chevron-right"></i>
    </a>
</div>